<template >
  <edit-form ref="form" label-width="calc(6em + 12px)" :model="form" :fields="fields" :rules="rules">
    <template #item-sjqtCode>
      <div class="yq-sign__group">
        <dg-select v-model="form.sjqtCode" :data="constant.BM_QTLB_QTXX" :disabled="noGroup" multiple></dg-select>
        <el-checkbox v-model="noGroup" class="form-item-checked-radio" @change="() => (form.sjqtCode = '')">
          无涉及群体
        </el-checkbox>
      </div>
    </template>
  </edit-form>
</template>
<script>
import EditForm from '@@/edit-form';
import { findJrzs, findDrzhz } from '@/api/common';
import { mapState } from 'vuex';
export default {
  name: 'Sign',
  data() {
    return {
      noGroup: false,
      form: {
        jjcd: '',
        sjqtCode: '',
        xxdtpgCode: '',
        cbyj: '',
        submit: '',
        nxdzl: '',
        nblyj: '',
        bz: '',
        drzsCode: '',
        drzhzCode: ''
      },
      djrzs: [],
      jrzs: [],
      rules: {
        jjcd: [{ required: true, message: '请选择紧急程度', trigger: 'blur' }]
      }
    };
  },
  props: {
    otherForm: {
      type: Function
    },
    sourceData: {
      type: Object,
      default(){
        return {}
      }
    }
  },
  components: {
    EditForm
  },
  computed: {
    ...mapState(['constant']),

    fields() {
      const vm = this;

      return [
        {
          prop: 'jjcd',
          label: '紧急程度',
          tag: 'dg-radio-group',
          tagBind: {
            data: vm.constant.BM_JJCD
          }
        },
        {
          prop: 'sjqtCode',
          label: '涉及群体',
          col: 12,
          tagBind: {
            lazyLoad: true,
          }
        },
        {
          prop: 'xxdtpgCode',
          label: '信息动态评估',
          col: 12,
          bind: {
            labelWidth: '8em'
          },
          tag: 'dg-select',
          tagBind: {
            data: vm.constant.BM_XXDTPG,
            multiple: true
          }
        },

        {
          prop: 'bz',
          label: '备注',
          tag: 'el-input',
          tagBind: {
            type: 'textarea',
            rows: 3,
            placeholder: '请输入内容',
            maxlength: '200',
            showWordLimit: true
          }
        },
        ...this.otherForm(this)()
      ];
    }
  },
  created() {
    this.$store.dispatch('getConstant', ['BM_JJCD', 'BM_XXDTPG', 'BM_QTLB_QTXX']);
    findJrzs().then(({ data }) => {
      this.jrzs = data;
    });
    findDrzhz().then(({ data }) => {
      this.djrzs = data;
    });
  },
  watch: {
    sourceData(new_val){
      // 初始化历史签收信息
      if (!_.isEmpty(new_val)){
        let form = Object.assign({}, this.form, new_val);
        this.$set(this, 'form', form);
      }
    }
  }
};
</script>
<style lang="scss" scoped>
.yq-sign__group {
  display: flex;
  align-items: center;

  .dg-radio {
    margin-left: 0.5rem;
  }
}

.edit-form {
  max-width: 1000px;
}
</style>
